<template>
	<view class="container">
		<view>
			<u-picker :show="show" ref="uPicker" :columns="columns" :title="title" @cancel="show = false"
				@confirm="confirm"></u-picker>
			<u-datetime-picker :minDate="newData" :show="dateTimeShow" mode="datetime" :title="title"
				@cancel="dateTimeShow = false" @confirm="checkDateTime"></u-datetime-picker>
      <u-toast ref="uToast"></u-toast>
			<u--form labelPosition="left" :model="from" :rules="rules" ref="form1" labelWidth='120px'
				:labelStyle='labelStyle'>
				<view class="title">
					基础信息
				</view>
				<view class="box">
					<u-form-item label="作业票名称" prop="zypmc" borderBottom>
						<u--input v-model="from.zypmc" placeholder="输入作业票名称" border="none"></u--input>
					</u-form-item>
					<u-form-item label="作业申请单位" prop="zysqdw" borderBottom
						@click="showType=1,itemClick('zysqdw', '作业申请单位')">
						<u--input v-model="from.zysqdw" placeholder="选择作业申请单位" border="none" disabled
							disabledColor="#ffffff"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="作业申请时间" prop="applyDate" borderBottom
						@click="dateTimeShow =true,dateTimeType=1,title='作业申请时间'">
						<u--input v-model="from.applyDate" placeholder="选择作业申请时间" border="none" disabled
							disabledColor="#ffffff"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item label="作业实施时间" prop="workImplementDate" borderBottom
						@click="dateTimeShow =true,dateTimeType=2,title='作业实施时间'">
						<u--input v-model="from.workImplementDate" placeholder="选择作业实施时间" border="none" disabled
							disabledColor="#ffffff"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<user-pick :label="'监护人'" :multiple="true" :placeholder="'请选择监护人'" v-model="from.jhr" :prop="'jhr'">
					</user-pick>
					<view style="color: #838383;padding: 10px 0">吊物内容</view>
					<u--textarea v-model="from.dwnr" placeholder="请输入..." height="120" confirmType="next"
						style="margin-bottom: 15px;background: #f6f6f6" count :maxlength="500"></u--textarea>

					<u-form-item label="吊装地点" prop="dzdd" borderBottom>
						<u--input v-model="from.dzdd" placeholder="请输入吊装地点" border="none"></u--input>
					</u-form-item>
					<u-form-item label="吊物质量" prop="dwzl" borderBottom>
						<u--input v-model="from.dwzl" placeholder="输入吊物质量（t）" border="none"></u--input>
					</u-form-item>
					<u-form-item label="作业级别" prop="zyjb" borderBottom @click="itemClick('zyjb', '作业级别')">
						<u--input v-model="from.zyjb" placeholder="选择作业级别" border="none" disabled
							disabledColor="#ffffff"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<user-pick :label="'司索人'" :multiple="false" :title="'司索人'" :placeholder="'请选择司索人'"
						v-model="from.ssr" :prop="'ssr'"></user-pick>
					<u-form-item label="作业单位" prop="zydw" borderBottom @click="itemClick('zydw', '作业单位')">
						<u--input v-model="from.zydw" placeholder="选择作业单位" border="none"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<user-pick
              :label="'指挥人员'"
              :multiple="false"
              :title="'指挥人员'"
              :placeholder="'请选择指挥人员'"
              v-model="from.zhry"
              :prop="'zhry'">
          </user-pick>
					<u-form-item label="吊具名称" prop="djmc" borderBottom>
						<u--input v-model="from.djmc" placeholder="输入吊具名称" border="none"></u--input>
					</u-form-item>
          <user-pick
              :label="'吊装作业人'"
              :multiple="false"
              :title="'吊装作业人'"
              :placeholder="'请选择吊装作业人'"
              v-model="from.dzzyr"
              :prop="'dzzyr'">
          </user-pick>
				</view>
				<view class="title">
					关联特殊作业
				</view>
				<view class="box">
					<u-form-item label="关联特殊作业" prop="gltszy"  @click="itemClick('gltszy', '关联特殊作业')">
						<u--input v-model="from.gltszy" placeholder="选择关联特殊作业" border="none" disabled disabledColor="#ffffff"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
				</view>
				<view class="title">
					危害辨识-安全措施
				</view>
        <view class="box" style="padding-bottom: 6px">
          <u-form-item label="危害辨识" prop="text" borderBottom @click="toHazardousFactors">
            <u--input v-model="from.text" placeholder="选择危害因素" border="none" disabled
                      disabledColor="#ffffff"></u--input>
            <u-icon slot="right" name="arrow-right"></u-icon>
          </u-form-item>
          <view
              style="background:#f6f6f6;margin-bottom: 30px;border-radius:8px;height: 200px;overflow-y: auto">
            <u-checkbox-group v-model="from.harm" placement="column" :labelSize='32'>
              <u-checkbox activeColor="#53c21d" v-for="(item,index) in from.harm" :label="item.label"
                          :name="item.value" shape="circle" :key="index" style="padding: 10px 20px" :checked=true>
              </u-checkbox>
            </u-checkbox-group>
          </view>
          <u-form-item label="安全措施" prop="text" borderBottom @click="toSafetyMeasures">
            <u--input v-model="from.text" placeholder="选择安全措施" border="none" disabled
                      disabledColor="#ffffff"></u--input>
            <u-icon slot="right" name="arrow-right"></u-icon>
          </u-form-item>
          <view
              style="background:#f6f6f6;margin-bottom: 30px;border-radius:8px;height: 200px;overflow-y: auto">
            <u-checkbox-group v-model="from.safetyMeasures" placement="column" :labelSize='32'>
              <u-checkbox activeColor="#53c21d" v-for="(item,index) in from.safetyMeasures" :label="item.label"
                          :name="item.value" shape="circle" :key="index" style="padding: 10px 20px" :checked=true>
              </u-checkbox>
            </u-checkbox-group>
          </view>
          <u-form-item label="个人用品防护" prop="text" borderBottom @click="toProtection">
            <u--input v-model="from.text" placeholder="选择个人用品防护" border="none"></u--input>
            <u-icon slot="right" name="arrow-right"></u-icon>
          </u-form-item>
          <view
              style="background:#f6f6f6;margin-bottom: 30px;border-radius:8px;height: 200px;overflow-y: auto">
            <u-checkbox-group v-model="from.personalProtection" placement="column" :labelSize='32'>
              <u-checkbox activeColor="#53c21d" v-for="(item,index) in from.personalProtection" :label="item.label"
                          :name="item.value" shape="circle" :key="index" style="padding: 10px 20px" :checked=true>
              </u-checkbox>
            </u-checkbox-group>
          </view>
        </view>
				<view class="title">
					安全交底
				</view>
				<view class="box">
          <user-pick
              :label="'安全交底人'"
              :multiple="false"
              :title="'安全交底人'"
              :placeholder="'请选择安全交底人'"
              v-model="from.aqjdr"
              :prop="'aqjdr'">
          </user-pick>
          <user-pick
              :label="'接受交底人'"
              :multiple="false"
              :title="'接受交底人'"
              :placeholder="'请选择接受交底人'"
              v-model="from.jsjdr"
              :prop="'jsjdr'">
          </user-pick>
				</view>
				<view class="title">
					安全教育
				</view>
				<view class="box">
          <user-pick
              :label="'实施安全教育人'"
              :multiple="false"
              :title="'实施安全教育人'"
              :placeholder="'请选择实施安全教育人'"
              v-model="from.ssaqjyr"
              :prop="'ssaqjyr'">
          </user-pick>
					<u-form-item label="是否已实施" prop="carryOut" borderBottom @click="itemClick('carryOut','是否已实施')">
						<u--input v-model="from.carryOut" placeholder="选择是否已实施" border="none" disabled disabledColor="#ffffff"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
				</view>
				<view class="title">
					审核人/审核部门
				</view>
				<view class="box">
					<u-form-item label="作业指挥意见" prop="jhx" borderBottom @click="itemClick('jhx','计划性')">
						<u--input v-model="from.jhx" placeholder="选择作业指挥意见" border="none" disabled disabledColor="#ffffff"></u--input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
          <user-pick
              :label="'所在单位审批人'"
              :multiple="false"
              :title="'所在单位审批人'"
              :placeholder="'选择所在单位审批人'"
              v-model="from.szdwspr"
              :prop="'szdwspr'">
          </user-pick>
          <user-pick
              :label="'审核部门意见'"
              :multiple="false"
              :title="'审核部门审核人'"
              :placeholder="'选择所在单位审核人'"
              v-model="from.bmshr"
              :prop="'bmshr'">
          </user-pick>
          <user-pick
              :label="'审批部门意见'"
              :multiple="false"
              :title="'审核部门审批人'"
              :placeholder="'选择所在部门审批人'"
              v-model="from.bmspr"
              :prop="'bmspr'">
          </user-pick>
				</view>
				<view class="title">
					验收
				</view>
				<view class="box">
          <user-pick
              :label="'验收人'"
              :multiple="false"
              :title="'验收人'"
              :placeholder="'选择验收人'"
              v-model="from.ysr"
              :prop="'ysr'">
          </user-pick>
				</view>
			</u--form>
			<u-button type="primary" text="申请" @click="submit" class='but'></u-button>
		</view>
	</view>
</template>

<script>
	import UTextarea from "../../../uni_modules/uview-ui/components/u-textarea/u-textarea";
	import userPick from "@/pages/Components/userPick";
	import {
		getDepartmentAPI,
    hoistingWorkingAPI,
    hoistingWorkAPI,
	} from "@/api/api.js"
	export default {
		components: {
			UTextarea,
			userPick,

		},
		data() {
			return {
				show: false,
				title: '',
				showType: 0,
				dateTimeType: 0,
				dateTimeShow: false,
				columns: [],
				columns2: [],
				columnData: [],
				newData: new Date().getTime(),
				labelStyle: {
					color: '#666'
				},
				from: {
					text: '',
					zypmc: '',
					zysqdw: '',
					dzdd: '',
					applyDate: '',
					workImplementDate: '',
					zysqsj: '',
					zysssj: '',
					jhr: '',
					dwnr: '',
					dwzl: '',
					zhry: '',
					zydw: '',
					djmc:'',
          dzzyr:'',
          gltszy:'',
          whbs:'',
          aqcs:'',
          grypfh:'',
          harm:[],
          safetyMeasures:[],
          personalProtection:[],
          jsjdr:'',
          aqjdr:'',
          ssaqjyr:'',
          carryOut:'',
          sfyss:'',
          szdwspr:'',
          bmshr:'',
          bmspr:'',
          ysr:''
				},
				rules: {},
				temKey: '',
				obj: {
					'zyjb': [['一级吊装作业', ' 二级吊装作业', '三级吊装作业']],
          'carryOut':[['待实施','已实施']],
          'jhx':[['非计划性','计划性']]
				}
			};
		},
    onShow() {
      let pages = getCurrentPages();
      let currPage = pages[pages.length - 1];
      let brand = currPage.brand
      if (!!brand) {
        if (brand.option) {
          this.from.harm = brand.option
          this.from.whbs = brand.optionList.toString()
        } else if (brand.list) {
          this.from.safetyMeasures = brand.list
          this.from.aqcs = brand.idList.toString()
        } else if (brand.fh) {
          this.from.personalProtection = brand.fh
          this.from.grypfh = brand.fhlist.toString()
        }
      }
    },
		methods: {
      toProtection() {
        uni.navigateTo({
          url: '../HotWork/protection/protection'
        })
      },
      toHazardousFactors() {
        uni.navigateTo({
          url: '../HotWork/hazardousFactors/hazardousFactors'
        })
      },
      toSafetyMeasures() {
        uni.navigateTo({
          url: '../HotWork/safetyMeasures/safetyMeasures'
        })
      },
			itemClick(key, title) {
				if (key === 'zysqdw' || key === 'zydw') {
					this.show = true
					this.title = title
					this.temKey = key
					getDepartmentAPI({}).then((r) => {
						let msg = r.data.map((e) => {
							return e.deptName
						})
						this.columns = [msg]
					})
				}else if (key === 'gltszy'){
          this.show = true
          this.title = title
          this.temKey = key
          hoistingWorkingAPI({}).then((r) => {
            let msg = r.data.map((e) => {
              return e.zypmc
            })
            this.columns = [msg]
            console.log(999,this.columns)
          })
        }else {
					this.show = true
					this.title = title
					this.temKey = key
					this.columns = this.obj[key]
				}
			},
			checkDateTime(e) {
				const timeFormat = uni.$u.timeFormat
				switch (this.dateTimeType) {
					case 1:
						this.from.applyDate = timeFormat(e.value, 'yyyy-mm-dd hh:MM')
						this.from.zysqsj = timeFormat(e.value, 'yyyymmddhhMM')
						break;
					case 2:
						this.from.workImplementDate = timeFormat(e.value, 'yyyy-mm-dd hh:MM')
						this.from.zysssj = timeFormat(e.value, 'yyyymmddhhMM')
						break;
				}
				this.dateTimeShow = false
			},
			confirm(e) {
				this.from[this.temKey] = e.value[0]
        this.from[this.temKey]==='待实施'?this.from.sfyss='0':this.from.sfyss='1'
				this.show = false
			},
			submit() {
        hoistingWorkAPI({...this.from}).then((r)=>{
        if(r.code === 200){
          this.$refs.uToast.show({
            type: "success",
            message: "申请成功",
            iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
          });
           setTimeout((e)=>{
            uni.navigateBack({
                  delta:1
                })
          },1000)
        }
        })
				console.log(this.from)
			}
		}
	}
</script>

<style lang="scss">
	.container {
		padding: 0 24rpx;
		background-color: #f6f6f6;

		.title {
			font-size: 28rpx;
			font-weight: 500;
			color: #999999;
			line-height: 44rpx;
			padding: 20rpx 48rpx;
		}

		.box {
			padding: 0rpx 48rpx;
			background-color: #fff;
			border-radius: 20rpx;
		}
	}

	.but {
		margin: 30rpx 0;
	}
</style>
